import './App.scss';
import { Button } from 'antd-mobile'
import React from 'react'
import { useSelector, useDispatch } from 'react-redux'
import { counterSlice } from '@/store/modules/couterSlice'
import { fetchUser } from './store/modules/userSlice';

function App() {
  const count = useSelector(state => state.counter.value)
  const username = useSelector(state => state.user.username)
  const dispatch = useDispatch()

  return (
    <div className="App">
      <Button color='primary' fill='solid'>
        按钮
      </Button>
      <Button
        aria-label="Increment value"
        onClick={() => dispatch(counterSlice.actions.increment())}
      >
        Increment
      </Button>
      <span>{count}</span>
      <Button
        aria-label="Decrement value"
        onClick={() => dispatch(counterSlice.actions.decrement())}
      >
        Decrement
      </Button>
      <Button color='success'
        aria-label="Decrement value"
        onClick={() => dispatch(fetchUser({
          name: 'admin',
          password: "123456"
        }))}
      >登录</Button>
      <span>{username}</span>
    </div>
  );
}

export default App;
